<template>
  <div>
    <header>
      <div class="beijin flex aic">
        <div class="fcc">
          <img
            src="https://img.villaday.com/images/view/member/default.png"
            class="imege"
            v-if="!isLogin"
          >
          <img
            src="http://lc-ttxw25v5.cn-n1.lcfile.com/9cbb184cb4d50579fbfd.jpg"
            class="imege"
            v-else
          >
          <router-link to="/login" id="login" class="f16 fff ml-20 w" v-if="!isLogin">立即登录</router-link>
          <p v-else class="f16 fff ml-20">{{username.slice(-4)}}</p>
        </div>
      </div>
    </header>

    <!-- 主体 -->
    <main>
      <div class="bg-fff">
        <router-link to="/order/orderList" class="flex jc-sb fcc bg-fff list bd-gray ml-10">
          <p class="fcc ml-10">
            <i class="iconfont iconemaxcitygerenxinxitubiaoji03 image"/>
            <span class="ml-10">我的订单</span>
          </p>
          <span class="icon iconfont iconrightArrow mr-10 gray"></span>
        </router-link>
        <div class="flex jc-sb fcc bg-fff list bd-gray ml-10">
          <p class="fcc ml-10">
            <i class="iconfont iconcard image"/>
            <span class="ml-10">我的共享卡</span>
          </p>
          <span class="icon iconfont iconrightArrow mr-10 gray"></span>
        </div>
        <div class="flex jc-sb fcc bg-fff list bd-gray ml-10">
          <p class="fcc ml-10">
            <i class="iconfont iconyouhuiquan image"/>
            <span class="ml-10">优惠券</span>
          </p>
          <span class="icon iconfont iconrightArrow mr-10 gray"></span>
        </div>
        <router-link to="/my/collect" class="flex jc-sb fcc bg-fff list bd-gray ml-10">
          <p class="fcc ml-10">
            <i class="iconfont iconhart image"/>
            <span class="ml-10">我想去</span>
          </p>
          <span class="icon iconfont iconrightArrow mr-10 gray"></span>
        </router-link>
        <router-link to="/my/history" class="flex jc-sb fcc bg-fff list bd-gray ml-10">
          <p class="fcc ml-10">
            <i class="iconfont iconeye image"/>
            <span class="ml-10">浏览记录</span>
          </p>
          <div>
            <span class="icon iconfont iconrightArrow mr-10 gray"></span>
          </div>
        </router-link>
      </div>

      <router-link to="/my/set" class>
        <div class="flex jc-sb fcc bg-fff list bd-gray pl-10 mt-20">
          <p class="fcc ml-10">
            <i class="iconfont iconsetting image"/>
            <span class="ml-10">设置</span>
          </p>
          <div>
            <span class="icon iconfont iconrightArrow mr-10 gray"></span>
          </div>
        </div>
      </router-link>
    </main>
    <Footer page="my"></Footer>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import Footer from "@/components/Footer";

export default {
  components: {
    Footer
  },
  computed: {
    ...mapGetters(["isLogin", "username"])
  },
  methods: {
    changToOrder() {
      if (this.isLogin) {
        this.$router.push("/order/list");
      } else {
        this.$router.push("/login");
      }
    },
    toSet() {
      if (this.isLogin) {
        this.$router.push("/my/set");
      } else {
        this.$router.push("/login");
      }
    }
  }
};
</script>
<style lang="less" scoped>
@import "../../style/center";
</style>

